<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.company.ems.model.User" %>
<%@ page import="com.company.ems.model.Employee" %>
<%@ page import="java.text.SimpleDateFormat" %>
<%
    User user = (User) session.getAttribute("user");
    if (user == null) {
        response.sendRedirect("../login.jsp");
        return;
    }
    
    Employee employee = (Employee) request.getAttribute("employee");
    if (employee == null) {
        response.sendRedirect("./");
        return;
    }
    
    SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy-MM-dd");
    SimpleDateFormat dateTimeFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>员工管理系统 - 查看员工</title>
    <link rel="stylesheet" href="../css/style.css">
</head>
<body>
    <div class="container">
        <!-- 头部 -->
        <div class="header">
            <h1>员工管理系统</h1>
            <div class="user-info">
                <span>欢迎，<%= user.getUsername() %></span>
                <a href="../logout" class="btn btn-secondary">退出登录</a>
            </div>
        </div>
        
        <!-- 导航栏 -->
        <div class="nav">
            <a href="../dashboard">仪表板</a>
            <a href="./" class="active">员工管理</a>
            <a href="./add">添加员工</a>
        </div>
        
        <!-- 内容区域 -->
        <div class="content">
            <div class="card fade-in">
                <div class="card-header">
                    员工详细信息
                    <div style="float: right;">
                        <!-- 修复链接路径问题 -->
                        <a href="./edit?id=<%= employee.getId() %>" class="btn btn-warning">编辑</a>
                        <a href="javascript:void(0)" onclick="confirmDelete(<%= employee.getId() %>, '<%= employee.getName() %>')" 
                           class="btn btn-danger">删除</a>
                    </div>
                </div>
                <div class="card-body">
                    <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 30px;">
                        <!-- 左侧信息 -->
                        <div>
                            <h4 style="margin-bottom: 20px; color: #495057; border-bottom: 2px solid #007bff; padding-bottom: 10px;">
                                基本信息
                            </h4>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">员工ID：</div>
                                <div><%= employee.getId() %></div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">姓名：</div>
                                <div style="font-size: 18px; font-weight: 600; color: #495057;">
                                    <%= employee.getName() %>
                                </div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">部门：</div>
                                <div>
                                    <span class="badge" style="background: #007bff; color: white; padding: 4px 12px; border-radius: 12px; font-size: 12px;">
                                        <%= employee.getDepartment() %>
                                    </span>
                                </div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">职位：</div>
                                <div>
                                    <span class="badge" style="background: #28a745; color: white; padding: 4px 12px; border-radius: 12px; font-size: 12px;">
                                        <%= employee.getPosition() %>
                                    </span>
                                </div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">薪资：</div>
                                <div style="font-size: 18px; font-weight: 600; color: #28a745;">
                                    ¥<%= String.format("%.2f", employee.getSalary()) %>
                                </div>
                            </div>
                        </div>
                        
                        <!-- 右侧信息 -->
                        <div>
                            <h4 style="margin-bottom: 20px; color: #495057; border-bottom: 2px solid #28a745; padding-bottom: 10px;">
                                联系信息
                            </h4>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">邮箱：</div>
                                <div>
                                    <% if (employee.getEmail() != null && !employee.getEmail().isEmpty()) { %>
                                        <a href="mailto:<%= employee.getEmail() %>" style="color: #007bff; text-decoration: none;">
                                            <%= employee.getEmail() %>
                                        </a>
                                    <% } else { %>
                                        <span style="color: #6c757d;">未设置</span>
                                    <% } %>
                                </div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">电话：</div>
                                <div>
                                    <% if (employee.getPhone() != null && !employee.getPhone().isEmpty()) { %>
                                        <a href="tel:<%= employee.getPhone() %>" style="color: #007bff; text-decoration: none;">
                                            <%= employee.getPhone() %>
                                        </a>
                                    <% } else { %>
                                        <span style="color: #6c757d;">未设置</span>
                                    <% } %>
                                </div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">入职时间：</div>
                                <div>
                                    <span style="color: #495057;">
                                        <%= dateFormat.format(employee.getHireDate()) %>
                                    </span>
                                </div>
                            </div>
                            
                            <h4 style="margin: 30px 0 20px 0; color: #495057; border-bottom: 2px solid #ffc107; padding-bottom: 10px;">
                                系统信息
                            </h4>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">创建者ID：</div>
                                <div><%= employee.getCreatedBy() %></div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">创建时间：</div>
                                <div style="color: #6c757d; font-size: 14px;">
                                    <%= employee.getCreatedAt() != null ? dateTimeFormat.format(employee.getCreatedAt()) : "-" %>
                                </div>
                            </div>
                            
                            <div class="info-row" style="display: flex; margin-bottom: 15px;">
                                <div style="width: 100px; font-weight: 500; color: #6c757d;">更新时间：</div>
                                <div style="color: #6c757d; font-size: 14px;">
                                    <%= employee.getUpdatedAt() != null ? dateTimeFormat.format(employee.getUpdatedAt()) : "-" %>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- 操作按钮 -->
                    <div style="margin-top: 30px; padding-top: 20px; border-top: 1px solid #dee2e6; text-align: center;">
                        <!-- 修复链接路径问题 -->
                        <a href="./edit?id=<%= employee.getId() %>" class="btn btn-warning">编辑信息</a>
                        <a href="./" class="btn btn-primary">返回列表</a>
                        <a href="../dashboard" class="btn btn-secondary">返回仪表板</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <script>
        function confirmDelete(id, name) {
            if (confirm('确定要删除员工 "' + name + '" 吗？此操作不可恢复。')) {
                window.location.href = './delete?id=' + id;
            }
        }
    </script>
</body>
</html>